/* ========== DARK MODE STYLES ========== */

/* Переменные для светлой и темной тем */
:root {
  --bg-primary: #ffffff;
  --bg-secondary: #f3f5f5;
  --bg-tertiary: #ffffff;
  --text-primary: #333333;
  --text-secondary: #666666;
  --text-muted: #999999;
  --border-color: #e0e0e0;
  --accent-color: #38741a;
  --accent-hover: #2a5b13;
  --shadow-color: rgba(0, 0, 0, 0.1);
  --card-bg: #ffffff;
  --player-bg: #ffffff;
  --header-bg: #38741a;
  --link-color: #38741a;
  --link-hover: #2a5b13;
}

.dark-theme {
  --bg-primary: #121212;
  --bg-secondary: #1e1e1e;
  --bg-tertiary: #252525;
  --text-primary: #ffffff;
  --text-secondary: #b0b0b0;
  --text-muted: #888888;
  --border-color: #333333;
  --accent-color: #4CAF50;
  --accent-hover: #388E3C;
  --shadow-color: rgba(0, 0, 0, 0.3);
  --card-bg: #1e1e1e;
  --player-bg: #252525;
  --header-bg: #1a1a1a;
  --link-color: #4CAF50;
  --link-hover: #ffffff;
}

/* Отключаем переходы при переключении темы */
.dark-theme-transitioning * {
  transition: none !important;
}

/* Основные стили для темной темы */
.dark-theme {
  background-color: var(--bg-primary);
  color: var(--text-primary);
}

/* Базовые transition только для необходимых свойств */
body {
  transition: background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1),
              color 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ========== ОСНОВНЫЕ ЭЛЕМЕНТЫ ========== */

/* Блоки контента */
.dark-theme .main-center-block {
  background-color: var(--bg-secondary);
  box-shadow: 0 0 13px rgba(0, 0, 0, 0.5);
}

.dark-theme .center-block,
.dark-theme .top-block,
.dark-theme .wrapsearch,
.dark-theme .full-news,
.dark-theme .stt-block {
  background-color: var(--bg-tertiary);
  border: 1px solid var(--border-color);
}

/* Заголовки */
.dark-theme .center-block-title,
.dark-theme .top-block-title,
.dark-theme .full-news h1,
.dark-theme .full-block-title,
.dark-theme .category-title,
.dark-theme h1,
.dark-theme h2,
.dark-theme h3,
.dark-theme h4 {
  color: var(--text-primary) !important;
}

/* Текстовое содержимое */
.dark-theme .center-block-content,
.dark-theme .full-block-content,
.dark-theme .info-line,
.dark-theme .full-news-text,
.dark-theme .main-news-text,
.dark-theme .albums-news-text,
.dark-theme .hello-block-content,
.dark-theme .profile-tt-text {
  color: var(--text-secondary) !important;
}

/* Треки */
.dark-theme .top-song {
  background-color: var(--card-bg);
  border-color: var(--border-color);
}

.dark-theme .top-song:hover {
  background-color: var(--bg-secondary);
}

.dark-theme .top-song-author,
.dark-theme .top-song-song,
.dark-theme .new-song .top-song-link,
.dark-theme .left-song-author,
.dark-theme .left-song-song {
  color: var(--text-secondary) !important;
}

/* ========== ССЫЛКИ И НАВИГАЦИЯ ========== */

.dark-theme a {
  color: #a9bb9b !important;
}

.dark-theme a:hover {
  color: var(--link-hover) !important;
}

.dark-theme .info-line a {
  color: #fdfbfb !important;
}

.dark-theme .info-line a:hover {
  color: var(--link-hover) !important;
}

/* Навигация */
.dark-theme .navigation-left a {
  background-color: var(--bg-tertiary);
  color: var(--text-primary) !important;
}

.dark-theme .navigation-center a {
  background-color: #808c76;
  border-color: #000000;
}

/* ========== ФОРМЫ И КНОПКИ ========== */

/* Формы */
.dark-theme input,
.dark-theme textarea,
.dark-theme select,
.dark-theme .form-text,
.dark-theme .form-line-tt input,
.dark-theme .form-line-tt textarea,
.dark-theme .login-input-text,
.dark-theme .lost-input-text {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-color) !important;
}

/* Кнопки */
.dark-theme .form-button-tt,
.dark-theme input#dosearch,
.dark-theme input#dofullsearch,
.dark-theme .open-com-form,
.dark-theme .enter,
.dark-theme .vote-buttom {
  background-color: var(--accent-color) !important;
  color: white !important;
  border-color: var(--accent-color) !important;
}

.dark-theme .form-button-tt:hover,
.dark-theme input#dosearch:hover,
.dark-theme input#dofullsearch:hover,
.dark-theme .open-com-form:hover,
.dark-theme .enter:hover,
.dark-theme .vote-buttom:hover {
  background-color: var(--accent-hover) !important;
  border-color: var(--accent-hover) !important;
}

/* ========== ПЛЕЕР ========== */

.dark-theme .new-player {
  background-color: var(--player-bg);
}

.dark-theme .audioplayer-bar {
  background-color: #444;
}

.dark-theme .audioplayer-bar-played {
  background-color: var(--accent-color);
}

.dark-theme .fill-bar-glob {
  background-color: #444;
}

.dark-theme .pop-player-image.start-play-btn {
  background-color: var(--accent-color) !important;
}

.dark-theme .pop-player-image.start-play-btn:hover {
  background-color: var(--accent-hover) !important;
}

.dark-theme .pop-title-art {
  color: var(--text-secondary) !important;
}

.dark-theme .pop-title-song {
  color: var(--link-color) !important;
}

.dark-theme .pop-title-song:hover {
  color: var(--link-hover) !important;
}

/* ========== САЙДБАРЫ ========== */

.dark-theme .left-block-title,
.dark-theme .right-block-title {
  background-color: #5f6955 !important;
  color: white !important;
}

.dark-theme .right-block-content a {
  color: var(--text-secondary) !important;
}

.dark-theme .right-block-content a:hover {
  color: var(--text-primary) !important;
  background-color: var(--bg-secondary) !important;
}

/* ========== КОММЕНТАРИИ ========== */

.dark-theme .comment-item {
  background-color: var(--bg-tertiary);
  border-color: var(--border-color);
}

.dark-theme .comment-item-author {
  color: var(--link-color) !important;
}

.dark-theme .comment-item-date {
  color: var(--text-muted) !important;
}

.dark-theme .comment-item-text {
  color: var(--text-secondary) !important;
}

.dark-theme .comments-item-links a {
  color: var(--text-muted) !important;
  border-bottom-color: var(--border-color) !important;
}

.dark-theme .comments-item-links a:hover {
  color: var(--text-secondary) !important;
}

/* ========== СПЕЦИАЛЬНЫЕ ЭЛЕМЕНТЫ ========== */

/* Теги */
.dark-theme .tags-link a,
.dark-theme .tags-list a {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border: 1px solid var(--border-color) !important;
}

.dark-theme .tags-link a:hover,
.dark-theme .tags-list a:hover {
  background-color: var(--accent-color) !important;
  color: white !important;
  border-color: var(--accent-color) !important;
}

/* Цитаты */
.dark-theme .quote {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border-color: var(--border-color) !important;
}

/* Рейтинг */
.dark-theme .ratingtt-left a,
.dark-theme .ratingtt-center,
.dark-theme .ratingtt-right a {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border-color: var(--border-color) !important;
}

/* ========== XFIELDS (ДИНАМИЧЕСКИЕ ПОЛЯ) ========== */

.dark-theme [xfvalue],
.dark-theme .xfvalue,
.dark-theme .xfield {
  color: var(--text-secondary) !important;
}

.dark-theme [xfvalue author],
.dark-theme [xfvalue song],
.dark-theme .xfvalue-author,
.dark-theme .xfvalue-song {
  color: var(--text-primary) !important;
  font-weight: 600 !important;
}

/* ========== КНОПКА ПЕРЕКЛЮЧЕНИЯ ТЕМЫ ========== */

/* Фиксированная кнопка */
.theme-switcher {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 1000;
}

.theme-toggle {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: var(--accent-color);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
  transition: all 0.3s ease;
}

.theme-toggle:hover {
  transform: scale(1.1);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
}

.theme-toggle i {
  font-size: 20px;
  color: white;
}

.dark-theme .theme-toggle i.fa-sun {
  display: none;
}

.dark-theme .theme-toggle i.fa-moon {
  display: inline-block;
}

.theme-toggle i.fa-moon {
  display: none;
}

.theme-toggle i.fa-sun {
  display: inline-block;
}

/* Кнопка в шапке */
.header-theme-switcher {
  position: absolute;
  top: 15px;
  right: 15px;
  z-index: 100;
}

.header-toggle {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--bg-tertiary);
  border: 2px solid var(--border-color);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: var(--text-primary);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.header-toggle:hover {
  transform: scale(1.1);
  border-color: var(--accent-color);
  box-shadow: inset 20px -17px 20px 20px rgb(243 245 245);
}

.dark-theme .header-toggle {
  background: #3a4a2d;;
}

/* ========== ИСПРАВЛЕНИЯ ДЛЯ КОНКРЕТНЫХ ЭЛЕМЕНТОВ ========== */

/* Информация о треке */
.dark-theme .full-news-info .info-line {
  color: var(--text-secondary) !important;
}

.dark-theme .full-news-info .info-line .info-value {
  color: #fdfbfb !important;
}

/* Уведомления */
.dark-theme .legal-notice {
  background-color: var(--bg-tertiary) !important;
  border: 1px solid var(--border-color) !important;
  color: var(--text-secondary) !important;
}

.dark-theme .legal-notice .notice-title {
  background-color: #252525 !important;
  color: white !important;
  border-bottom: 1px solid #656363 !important;
}

.dark-theme .legal-notice .notice-content {
  color: var(--text-secondary) !important;
}

.dark-theme .legal-notice strong span,
.dark-theme .legal-notice strong span b {
  color: var(--text-primary) !important;
  font-weight: 600 !important;
}

.dark-theme .legal-notice .notice-content span[style*="color: rgb(62, 117, 46)"] {
  color: var(--accent-color) !important;
}

/* Welcome notice */
.dark-theme .welcome-notice {
  background: linear-gradient(135deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%) !important;
  border-color: #595959 !important;
}

.dark-theme .welcome-notice .notice-title {
  background-color: #252525 !important;
  color: white !important;
}

/* Блок тегов */
.dark-theme .tags-block {
  background-color: var(--bg-tertiary) !important;
  border: 1px solid var(--border-color) !important;
}

.dark-theme .tags-title {
  background-color: var(--bg-secondary) !important;
  border-bottom: 1px solid var(--border-color) !important;
  color: var(--text-primary) !important;
}

.dark-theme .tags-title h3 {
  color: var(--text-primary) !important;
}

.dark-theme .tags-title i {
  color: var(--accent-color) !important;
}

/* ========== ИКОНКИ ========== */

.dark-theme .full-news-info .fa,
.dark-theme .legal-notice .fa,
.dark-theme .tags-block .fa,
.dark-theme .welcome-notice .fa,
.dark-theme .features-list i,
.dark-theme .disclaimer i {
  color: var(--accent-color) !important;
}

/* ========== МЕДИА-ЗАПРОСЫ ========== */

@media (max-width: 768px) {
  .theme-switcher {
    bottom: 70px;
    right: 15px;
  }
  
  .theme-toggle {
    width: 45px;
    height: 45px;
  }
  
  .header-theme-switcher {
    top: 10px;
    right: 10px;
  }
  
  .header-toggle {
    width: 36px;
    height: 36px;
    font-size: 16px;
  }
}

/* ========== ИЗОБРАЖЕНИЯ В ТЕМНОЙ ТЕМЕ ========== */

.dark-theme img:not(.logo):not(.avatar) {
  opacity: 0.9;
  filter: brightness(0.9);
}

.dark-theme img:hover {
  opacity: 1;
  filter: brightness(1);
}

/* Фоновые изображения */
.dark-theme .main-center-block {
  position: relative;
}

.dark-theme .main-center-block::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.7);
  z-index: 0;
}

.dark-theme .main-center-block > * {
  position: relative;
  z-index: 1;
}

/* ========== ДОПОЛНИТЕЛЬНЫЕ ЭЛЕМЕНТЫ ========== */

/* Мобильное меню */
.dark-theme .mob-panel {
  background-color: var(--bg-tertiary);
}

.dark-theme .mob-shad {
  background: #000;
  opacity: 0.8;
}

/* Таблицы */
.dark-theme table {
  background-color: var(--bg-tertiary);
}

.dark-theme table tr:nth-child(even) {
  background-color: var(--bg-secondary);
}

.dark-theme table td {
  border-color: var(--border-color);
  color: var(--text-secondary) !important;
}

/* Футер */
.dark-theme .footer {
  color: var(--text-secondary);
}

.dark-theme .footer a {
  color: var(--text-primary);
}

/* Disclaimer */
.dark-theme .disclaimer {
  background-color: var(--bg-secondary) !important;
  color: var(--text-secondary) !important;
  border-left-color: var(--accent-color) !important;
}

/* Профиль пользователя */
.dark-theme .user-profile-tt,
.dark-theme .tabs-profile .tt-panel {
  background-color: var(--bg-tertiary) !important;
  border-color: var(--border-color) !important;
}

.dark-theme .profile-tt-info,
.dark-theme .profile-tt-text {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
}

.dark-theme .profile-tt-menu a {
  background-color: var(--bg-secondary) !important;
  color: var(--text-secondary) !important;
}

.dark-theme .profile-tt-menu a:hover {
  background-color: var(--accent-color) !important;
  color: white !important;
}

/* Модальные окна */
.dark-theme .ui-dialog {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

.dark-theme .ui-dialog-titlebar {
  background-color: var(--bg-secondary) !important;
  border-bottom-color: var(--border-color) !important;
}

.dark-theme .ui-dialog-buttonset {
  background-color: var(--bg-secondary) !important;
  border-top-color: var(--border-color) !important;
}

.dark-theme .ui-dialog-buttonset button {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
}

.dark-theme .ui-dialog-buttonset button:hover {
  background-color: var(--accent-color) !important;
  color: white !important;
}

/* ========== ACCESSIBILITY ========== */

.dark-theme :focus-visible {
  outline: 2px solid var(--accent-color);
  outline-offset: 2px;
}

/* Указываем браузеру о поддержке тем */
:root {
  color-scheme: light dark;
}

/* ========== ДОПОЛНЕНИЯ ДЛЯ DARK MODE ========== */

/* Стили для динамически генерируемых полей [xfvalue] */
.dark-theme [xfvalue],
.dark-theme .xfvalue,
.dark-theme .xfield {
  color: var(--text-secondary) !important;
}

.dark-theme [xfvalue author],
.dark-theme [xfvalue song],
.dark-theme .xfvalue-author,
.dark-theme .xfvalue-song {
  color: var(--text-primary) !important;
}

/* Специально для полей author и song в разных местах */
.dark-theme .left-song-author,
.dark-theme .left-song-song,
.dark-theme .top-song-author,
.dark-theme .top-song-song,
.dark-theme .new-song .top-song-link,
.dark-theme .new-song .top-song-author,
.dark-theme .new-song .top-song-song {
  color: var(--text-secondary) !important;
}

/* Для заголовков в разных блоках */
.dark-theme .main-news-title a,
.dark-theme .albums-news-title a,
.dark-theme .full-news-info h1,
.dark-theme .full-news-info h2,
.dark-theme .full-block-title,
.dark-theme .center-block-title,
.dark-theme .category-title,
.dark-theme .top-block-title {
  color: var(--text-primary) !important;
}

/* Для текстового содержимого */
.dark-theme .main-news-text,
.dark-theme .albums-news-text,
.dark-theme .full-news-text,
.dark-theme .full-block-content,
.dark-theme .center-block-content,
.dark-theme .info-line,
.dark-theme .hello-block-content,
.dark-theme .profile-tt-text {
  color: var(--text-secondary) !important;
}

/* Для ссылок */
.dark-theme .main-news-title a:hover,
.dark-theme .albums-news-title a:hover,
.dark-theme .full-block-content a {
  color: var(--link-hover) !important;
}

/* Для мета-информации */
.dark-theme .info-line a {
  color: #abbb9c !important;
}

.dark-theme .info-line a:hover {
  color: var(--link-hover) !important;
}

/* Для элементов форм в темной теме */
.dark-theme .form-line-tt input,
.dark-theme .form-line-tt textarea,
.dark-theme .login-input-text,
.dark-theme .lost-input-text {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-color) !important;
}

/* Для кнопок в темной теме */
.dark-theme .open-com-form,
.dark-theme .enter,
.dark-theme .vote-buttom,
.dark-theme .form-button-tt {
  background-color: var(--accent-color) !important;
  color: white !important;
  border-color: var(--accent-color) !important;
}

.dark-theme .open-com-form:hover,
.dark-theme .enter:hover,
.dark-theme .vote-buttom:hover,
.dark-theme .form-button-tt:hover {
  background-color: var(--accent-hover) !important;
  border-color: var(--accent-hover) !important;
}

/* Для плеера */
.dark-theme .pop-player-image.start-play-btn {
  background-color: var(--accent-color) !important;
}

.dark-theme .pop-player-image.start-play-btn:hover {
  background-color: var(--accent-hover) !important;
}

.dark-theme .pop-title-art {
  color: var(--text-secondary) !important;
}

.dark-theme .pop-title-song {
  color: var(--link-color) !important;
}

.dark-theme .pop-title-song:hover {
  color: var(--link-hover) !important;
}

/* Для правой колонки */
.dark-theme .right-block-content a {
  color: var(--text-secondary) !important;
}

.dark-theme .right-block-content a:hover {
  color: var(--text-primary) !important;
  background-color: var(--bg-secondary) !important;
}

.dark-theme .tags-link a {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
}

.dark-theme .tags-link a:hover {
  background-color: var(--accent-color) !important;
  color: white !important;
}

/* Для комментариев */
.dark-theme .comment-item-author {
  color: var(--link-color) !important;
}

.dark-theme .comment-item-date {
  color: var(--text-muted) !important;
}

.dark-theme .comment-item-text {
  color: var(--text-secondary) !important;
}

.dark-theme .comments-item-links a {
  color: var(--text-muted) !important;
  border-bottom-color: var(--border-color) !important;
}

.dark-theme .comments-item-links a:hover {
  color: var(--text-secondary) !important;
}

/* Для цитат */
.dark-theme .quote {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border-color: var(--border-color) !important;
}

/* Для рейтинга */
.dark-theme .ratingtt-left a,
.dark-theme .ratingtt-center,
.dark-theme .ratingtt-right a {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border-color: var(--border-color) !important;
}

/* Для модальных окон */
.dark-theme .ui-dialog {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

.dark-theme .ui-dialog-titlebar {
  background-color: var(--bg-secondary) !important;
  border-bottom-color: var(--border-color) !important;
}

.dark-theme .ui-dialog-buttonset {
  background-color: var(--bg-secondary) !important;
  border-top-color: var(--border-color) !important;
}

.dark-theme .ui-dialog-buttonset button {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
}

.dark-theme .ui-dialog-buttonset button:hover {
  background-color: var(--accent-color) !important;
  color: white !important;
}

/* Для профиля пользователя */
.dark-theme .user-profile-tt,
.dark-theme .tabs-profile .tt-panel {
  background-color: var(--bg-tertiary) !important;
  border-color: var(--border-color) !important;
}

.dark-theme .profile-tt-info,
.dark-theme .profile-tt-text {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
}

.dark-theme .profile-tt-menu a {
  background-color: var(--bg-secondary) !important;
  color: var(--text-secondary) !important;
}

.dark-theme .profile-tt-menu a:hover {
  background-color: var(--accent-color) !important;
  color: white !important;
}

/* Для списков */
.dark-theme .features-list li {
  color: var(--text-secondary) !important;
}

.dark-theme .features-list i {
  color: var(--accent-color) !important;
}

.dark-theme .disclaimer {
  background-color: var(--bg-secondary) !important;
  color: var(--text-secondary) !important;
  border-left-color: #ffffff !important;
}

.dark-theme .disclaimer i {
  color: var(--accent-color) !important;
}

/* Исправляем контрастность для всех текстовых элементов */
.dark-theme *:not(a):not(button):not(input):not(textarea):not(select):not([class*="icon"]):not([class*="fa-"]):not(i) {
  color: var(--text-primary) !important;
}

.dark-theme *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not([class*="title"]):not([class*="name"]):not(a):not(button) {
  color: #ffffff !important;
}

/* Важное правило для всех элементов - переопределяем цвет текста */
.dark-theme {
  color: var(--text-primary) !important;
}

.dark-theme div,
.dark-theme span,
.dark-theme p,
.dark-theme li,
.dark-theme td,
.dark-theme th {
  color: var(--text-secondary) !important;
}

.dark-theme h1,
.dark-theme h2,
.dark-theme h3,
.dark-theme h4,
.dark-theme h5,
.dark-theme h6,
.dark-theme [class*="title"],
.dark-theme [class*="name"],
.dark-theme [xfvalue author],
.dark-theme [xfvalue song] {
  color: var(--text-primary) !important;
}

/* Базовые стили (светлая тема) */
.main-center-block {
    background: #f3f5f5 var(--bg-image-light) left top repeat-y;
}

.top-block-title {
    background: var(--bg-image-light) left top no-repeat;
}

/* Темная тема */
.dark-theme .main-center-block {
    background: var(--bg-secondary) var(--bg-image-dark) left top repeat-y !important;
}

.dark-theme .top-block-title {
    background: var(--bg-tertiary) var(--bg-image-dark) left top no-repeat !important;
}
/* ========== ИСПРАВЛЕНИЯ ДЛЯ ПРОБЛЕМНЫХ ЭЛЕМЕНТОВ ========== */

/* 1. Для основной информации о треке */
.dark-theme .full-news-info .info-line .info-value,
.dark-theme .full-news-info .info-line {
    color: #acbb9e !important;
}

/* Специально для автора и названия трека в info-line */
.dark-theme .full-news-info .info-line .info-value span,
.dark-theme .full-news-info .info-line [xfvalue_author],
.dark-theme .full-news-info .info-line [xfvalue_song] {
    color: var(--text-primary) !important;
    font-weight: 600;
}

/* Переопределяем встроенные стили для xfvalue */
.dark-theme [xfvalue_author],
.dark-theme [xfvalue_song] {
    color: var(--text-primary) !important;
    font-family: inherit !important;
    font-weight: 600 !important;
}

/* Для всех элементов с xfvalue_ */
.dark-theme [xfvalue_],
.dark-theme *[xfvalue_] {
    color: var(--text-secondary) !important;
}

/* 2. Для уведомления (legal-notice) */
.dark-theme .legal-notice {
    background-color: var(--bg-tertiary) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-secondary) !important;
}

.dark-theme .legal-notice .notice-title {
    background-color: #808c76 !important;
    color: white !important;
    border-bottom: 1px solid var(--border-color) !important;
}

.dark-theme .legal-notice .notice-title i {
    color: white !important;
}

.dark-theme .legal-notice .notice-content {
    color: var(--text-secondary) !important;
}

/* Специально для встроенных стилей в уведомлении */
.dark-theme .legal-notice strong span {
    color: var(--text-primary) !important;
    font-family: inherit !important;
}

.dark-theme .legal-notice strong span b,
.dark-theme .legal-notice strong b {
    color: var(--text-primary) !important;
    font-weight: 600 !important;
}

/* Переопределяем конкретный встроенный стиль */
.dark-theme .legal-notice .notice-content span[style*="color: rgb(62, 117, 46)"] {
    color: var(--accent-color) !important;
}

.dark-theme .legal-notice .notice-content span[style*="font-family: Arial"] {
    font-family: inherit !important;
}

/* 3. Для тегов */
.dark-theme .tags-block {
    background-color: var(--bg-tertiary) !important;
    border: 1px solid var(--border-color) !important;
}

.dark-theme .tags-title {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
}

.dark-theme .tags-title h3 {
    color: var(--text-primary) !important;
}

.dark-theme .tags-title i {
    color: var(--accent-color) !important;
}

.dark-theme .tags-list a {
    background-color: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
    border: 1px solid var(--border-color) !important;
}

.dark-theme .tags-list a:hover {
    background-color: var(--accent-color) !important;
    color: white !important;
    border-color: var(--accent-color) !important;
}

/* 4. Для welcome-notice */
.dark-theme .welcome-notice {
    background: linear-gradient(135deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%) !important;
    border-color: #808c76 !important;
}

.dark-theme .welcome-notice .notice-title {
    background-color: #808c76 !important;
    color: white !important;
}

.dark-theme .welcome-notice .notice-content i {
    color: var(--accent-color) !important;
}

/* 5. СИЛЬНЫЙ ПЕРЕОПРЕДЕЛЯЮЩИЙ СТИЛЬ для всех проблемных элементов */
.dark-theme .full-news-info *,
.dark-theme .legal-notice *,
.dark-theme .tags-block * {
    color: inherit !important;
    background-color: inherit !important;
    border-color: inherit !important;
}

/* 6. Для иконок FontAwesome в этих блоках */
.dark-theme .full-news-info .fa,
.dark-theme .legal-notice .fa,
.dark-theme .tags-block .fa {
    color: var(--accent-color) !important;
}









/* Основные стили аудиоплеера */
.player-container {
    max-width: 100%;
    margin: 5px auto;
    padding: 10px;
    background: #1a1a1a;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
}

/* Скрываем стандартный аудио элемент */
.custom-audio-player audio {
    display: none !important;
    visibility: hidden !important;
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
}

/* Контейнер элементов управления */
.player-controls {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 25px;
    flex-wrap: wrap;
}

/* Кнопка воспроизведения/паузы */
.play-btn {
    width: 50px;
    height: 50px;
    min-width: 50px;
    border-radius: 50%;
    background: #616b58;
    border: none;
    color: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    outline: none;
    position: relative;
    overflow: hidden;
}

.play-btn:focus-visible {
    outline: 2px solid #4a6cf7;
    outline-offset: 2px;
}

.play-btn:hover {
    background: #3d4d30;
    transform: scale(1.05);
}

.play-btn:active {
    transform: scale(0.95);
}

.play-btn::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    transform: translate(-50%, -50%) scale(0);
    transition: transform 0.3s ease;
}

.play-btn:active::after {
    transform: translate(-50%, -50%) scale(1);
    animation: ripple 0.6s linear;
}

@keyframes ripple {
    0% {
        transform: translate(-50%, -50%) scale(0);
        opacity: 1;
    }
    100% {
        transform: translate(-50%, -50%) scale(2);
        opacity: 0;
    }
}

/* Область прогресса */
.progress-area {
    flex-grow: 1;
    min-width: 200px;
}

/* Прогресс-бар */
.progress-bar {
    height: 6px;
    background: #333;
    border-radius: 3px;
    cursor: pointer;
    margin-bottom: 8px;
    position: relative;
    overflow: hidden;
    transition: background 0.2s ease;
}

.progress-bar:hover {
    background: #444;
}

/* Индикатор прогресса */
.progress {
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, #2c411b, #829279);
    border-radius: 3px;
    transition: width 0.1s linear;
    position: relative;
}

.progress::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 12px;
    height: 12px;
    background: white;
    border-radius: 50%;
    opacity: 0;
    transition: opacity 0.2s ease;
    box-shadow: 0 0 5px rgba(0,0,0,0.5);
}

.progress-bar:hover .progress::after {
    opacity: 1;
}

/* Таймер */
.timer {
    display: flex;
    justify-content: space-between;
    color: #999;
    font-size: 13px;
    font-family: 'Roboto Mono', 'Courier New', monospace;
    letter-spacing: -0.5px;
}

.timer span {
    opacity: 0.9;
}

/* Контроль громкости */
.volume-control {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #999;
    min-width: 120px;
}

.volume-control i {
    font-size: 16px;
    transition: color 0.2s ease;
}

.volume-control:hover i {
    color: #4a6cf7;
}

/* Слайдер громкости */
.volume-slider {
    width: 80px;
    height: 4px;
    -webkit-appearance: none;
    background: #333;
    border-radius: 2px;
    outline: none;
    cursor: pointer;
    transition: background 0.2s ease;
}

.volume-slider:hover {
    background: #444;
}

.volume-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #4a6cf7;
    cursor: pointer;
    border: 2px solid white;
    box-shadow: 0 0 5px rgba(0,0,0,0.5);
    transition: all 0.2s ease;
}

.volume-slider::-webkit-slider-thumb:hover {
    background: #3a5ce5;
    transform: scale(1.1);
}

.volume-slider::-moz-range-thumb {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #4a6cf7;
    cursor: pointer;
    border: 2px solid white;
    box-shadow: 0 0 5px rgba(0,0,0,0.5);
}

.volume-slider::-moz-range-track {
    background: #333;
    height: 4px;
    border-radius: 2px;
}

/* Кнопка скачивания */
.download-btn-modern {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    background: linear-gradient(
93deg, #8c9b80 0%, #344525 100%);
    color: white;
    padding: 16px 40px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: inset -2px 6px 13px 0px rgb(70 86 57 / 77%);
    border: none;
    cursor: pointer;
    width: 100%;
    max-width: 300px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
}

.download-btn-modern::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: left 0.5s ease;
}

.download-btn-modern:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 25px rgba(75,95,62);
    color: white;
}

.download-btn-modern:hover::before {
    left: 100%;
}

.download-btn-modern:active {
    transform: translateY(0);
    box-shadow: 0 2px 10px rgba(74, 108, 247, 0.3);
}

.download-btn-modern i {
    font-size: 18px;
    transition: transform 0.3s ease;
}

.download-btn-modern:hover i {
    transform: translateY(2px);
}

/* Адаптивность */
@media (max-width: 768px) {
    .player-container {
        margin: 15px;
        padding: 20px;
        border-radius: 15px;
    }
    
    .player-controls {
        gap: 15px;
        flex-direction: column;
        align-items: stretch;
    }
    
    .progress-area {
        width: 100%;
    }
    
    .volume-control {
        width: 100%;
        justify-content: space-between;
    }
    
    .volume-slider {
        flex-grow: 1;
        max-width: 150px;
    }
    
    .download-btn-modern {
        padding: 14px 30px;
        font-size: 15px;
    }
}

@media (max-width: 480px) {
    .player-container {
        padding: 15px;
        margin: 10px;
    }
    
    .play-btn {
        width: 45px;
        height: 45px;
        min-width: 45px;
    }
    
    .timer {
        font-size: 12px;
    }
    
    .download-btn-modern {
        padding: 12px 25px;
        font-size: 14px;
    }
}

/* Состояния загрузки */
.player-container.loading .progress {
    background: linear-gradient(90deg, #4a6cf7 25%, #8a67ff 50%, #4a6cf7 75%);
    background-size: 200% 100%;
    animation: loading 1.5s infinite linear;
}

@keyframes loading {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

/* Состояние ошибки */
.player-container.error .play-btn {
    background: #ff4757;
}

.player-container.error .progress {
    background: #ff4757;
}

/* Улучшенный focus-visible для доступности */
.play-btn:focus-visible,
.volume-slider:focus-visible,
.download-btn-modern:focus-visible {
    outline: 2px solid #4a6cf7;
    outline-offset: 2px;
}

/* Темная тема по умолчанию (уже используется) */
.player-container.dark {
    background: #1a1a1a;
    color: #fff;
}

/* Светлая тема */
.player-container.light {
    background: #ffffff;
    color: #333;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}

.player-container.light .progress-bar {
    background: #e0e0e0;
}

.player-container.light .timer {
    color: #666;
}

.player-container.light .volume-control {
    color: #666;
}

.player-container.light .volume-slider {
    background: #e0e0e0;
}




/* CSS переменные для управления количеством колонок */
:root {
    --album-columns: 4; /* По умолчанию 4 колонки */
    --album-gap: 20px;
}

/* Контейнер для не-Swiper сетки */
.albums-grid {
    display: grid;
    grid-template-columns: repeat(var(--album-columns), 1fr);
    gap: var(--album-gap);
    padding: 20px 0;
}

/* Swiper контейнер с настройками колонок */
.swiper-container.columns-1 .swiper-slide {
    width: 100% !important;
}

.swiper-container.columns-2 .swiper-slide {
    width: calc(50% - var(--album-gap) / 2) !important;
}

.swiper-container.columns-3 .swiper-slide {
    width: calc(33.333% - var(--album-gap) * 2 / 3) !important;
}

.swiper-container.columns-4 .swiper-slide {
    width: calc(25% - var(--album-gap) * 3 / 4) !important;
}

/* Удаляем стили для 5-8 колонок, так как теперь максимум 4 */
.swiper-container.columns-5,
.swiper-container.columns-6,
.swiper-container.columns-7,
.swiper-container.columns-8 {
    display: none; /* Скрываем, если случайно применятся */
}

/* Базовые стили альбома */
.album-preview {
    background: #252525
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
    margin-bottom: 20px;
    border: 1px solid #5f6957;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.album-preview:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 20px rgba(0,0,0,0.15);
    border-color: #6A9D43;
}

.album-cover-wrapper {
    position: relative;
    overflow: hidden;
    height: 200px;
    flex-shrink: 0;
}

.album-cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.album-preview:hover .album-cover {
    transform: scale(1.05);
}

.album-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.7), transparent);
    opacity: 0;
    transition: opacity 0.3s ease;
    display: flex;
    flex-direction: column;
    justify-content: flex-end; /* Информация теперь снизу */
    align-items: center;
}

.album-preview:hover .album-overlay {
    opacity: 1;
}

/* Стиль для активного (играющего) трека */
.album-preview.playing {
    border-color: #6A9D43;
    box-shadow: 0 5px 20px rgba(106, 157, 67, 0.2);
}

.album-info-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,0.8);
    color: white;
    padding: 8px 10px;
    font-size: 12px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 5px;
    transform: translateY(100%);
    transition: transform 0.3s ease;
}

.album-preview:hover .album-info-overlay {
    transform: translateY(0);
}

.album-year {
    display: flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}

.album-details {
    padding: 15px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.album-title {
    margin-bottom: 10px;
}

.album-song {
    display: block;
    font-size: 16px;
    font-weight: 600;
    color: #3b3f45;
    margin-bottom: 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.album-artist {
    display: block;
    font-size: 14px;
    color: #272926;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.quick-player {
    margin-top: 10px;
}

.quick-player audio {
    display: none; /* Скрываем стандартный аудио плеер */
}

/* Кастомные контролы для аудио */
.custom-audio-controls {
    display: flex;
    gap: 4px;
    background: ##1a1b18;
    padding: 4px 10px;
    border-radius: 8px;
    border: 1px solid #5f6957;
    flex-direction: column;
}

.play-pause-btn {
    background: #4e5647;
    border: none;
    width: 35px;
    height: 35px;
    border-radius: 8%;
    color: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

.play-pause-btn:hover {
    background: #d00f32;
    transform: scale(1.05);
}

.play-pause-btn.playing {
    background: #d32f2f;
}

.play-pause-btn.playing:hover {
    background: #b71c1c;
}

.progress-container {
    flex-grow: 1;
    height: 4px;
    background: #ddd;
    border-radius: 2px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.progress-bar {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 0%;
    background: #6A9D43;
    border-radius: 2px;
    transition: width 0.1s linear;
}

.time-display {
    font-size: 11px;
    color: #666;
    font-family: monospace;
    min-width: 80px;
    text-align: center;
    flex-shrink: 0;
}

/* ==================== НАСТРОЙКИ ДЛЯ РАЗНОГО КОЛИЧЕСТВА КОЛОНОК ==================== */

/* 1 колонка */
.columns-1 .album-cover-wrapper {
    height: 300px;
}

.columns-1 .album-song {
    font-size: 20px;
}

.columns-1 .album-artist {
    font-size: 18px;
}

.columns-1 .album-info-overlay {
    font-size: 14px;
    padding: 12px 15px;
}

.columns-1 .custom-audio-controls {
    padding: 10px 12px;
}

.columns-1 .play-pause-btn {
    width: 35px;
    height: 35px;
}

/* 2 колонки */
.columns-2 .album-cover-wrapper {
    height: 250px;
}

.columns-2 .album-song {
    font-size: 18px;
}

.columns-2 .album-artist {
    font-size: 16px;
}

.columns-2 .album-info-overlay {
    font-size: 13px;
    padding: 10px 12px;
}

.columns-2 .custom-audio-controls {
    padding: 9px 11px;
}

.columns-2 .play-pause-btn {
    width: 32px;
    height: 32px;
}

/* 3 колонки */
.columns-3 .album-cover-wrapper {
    height: 220px;
}

.columns-3 .album-song {
    font-size: 17px;
}

.columns-3 .album-artist {
    font-size: 15px;
}

.columns-3 .album-info-overlay {
    font-size: 12px;
    padding: 9px 11px;
}

.columns-3 .custom-audio-controls {
    padding: 8px 10px;
}

/* 4 колонки (по умолчанию) */
.columns-4 .album-cover-wrapper {
    height: 200px;
}

.columns-4 .album-song {
    font-size: 16px;
}

.columns-4 .album-artist {
    font-size: 14px;
}

.columns-4 .album-info-overlay {
    font-size: 12px;
    padding: 8px 10px;
}

.columns-4 .custom-audio-controls {
    padding: 8px 10px;
}

/* ==================== СТИЛИ ДЛЯ КНОПОК УПРАВЛЕНИЯ КОЛОНКАМИ (ВНУТРИ SWIPER) ==================== */

.swiper-container {
    position: relative;
    padding-bottom: 60px; /* Добавляем отступ снизу для контролов */
}

.swiper-columns-controls {
    position: absolute;
    bottom: 10px;
    left: 0;
    right: 0;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    background: linear-gradient(135deg, #282d30, #223c0d);
    padding: 8px 15px;
    border-radius: 20px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
    transition: all 0.3s ease;
    border: 1px solid rgba(255, 255, 255, 0.3);
    margin: 0 10px;
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
}

.swiper-columns-controls:hover {
    background: linear-gradient(135deg, #596f4a, #000000);
    box-shadow: 0 6px 16px rgba(0,0,0,0.25);
    border-color: rgba(255, 255, 255, 0.4);
}

.columns-controls-title {
    font-size: 14px;
    font-weight: 600;
    color: white;
    white-space: nowrap;
    text-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

.columns-controls-buttons {
    display: flex;
    align-items: center;
    gap: 5px;
}

.column-control-btn {
    background: #4e5648;
    border: none;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 12px;
    color: #517E2C;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    outline: none;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.column-control-btn:hover {
    transform: scale(1.1);
    background: #000000;
    box-shadow: 0 3px 6px rgba(0,0,0,0.15);
}

.column-control-btn:active {
    transform: scale(0.95);
}

.column-control-btn[disabled] {
    opacity: 0.4;
    cursor: not-allowed;
    background: #e0e0e0;
    color: #999;
}

.column-control-btn[disabled]:hover {
    transform: none;
    background: #e0e0e0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.columns-counter {
    font-size: 14px;
    font-weight: bold;
    color: white;
    min-width: 22px;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0,0,0,0.2);
    background: rgba(255, 255, 255, 0.2);
    padding: 2px 6px;
    border-radius: 10px;
    margin: 0 3px;
}

.columns-reset-btn {
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.4);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 11px;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    margin-left: 5px;
}

.columns-reset-btn:hover {
    background: rgba(255, 255, 255, 0.3);
    transform: scale(1.1);
    box-shadow: 0 3px 6px rgba(0,0,0,0.15);
}

.columns-reset-btn:active {
    transform: scale(0.95);
}

/* ==================== АДАПТИВНЫЕ НАСТРОЙКИ ==================== */

/* Большие экраны (1400px и выше) */
@media (min-width: 1400px) {
    .albums-grid {
        --album-columns: 4;
    }
    
    .swiper-container:not([class*="columns-"]) .swiper-slide {
        width: calc(25% - var(--album-gap) * 3 / 4) !important;
    }
}

/* Десктопы (1200px - 1399px) */
@media (min-width: 1200px) and (max-width: 1399px) {
    .albums-grid {
        --album-columns: 4;
    }
    
    .swiper-container:not([class*="columns-"]) .swiper-slide {
        width: calc(25% - var(--album-gap) * 3 / 4) !important;
    }
}

/* Ноутбуки (992px - 1199px) */
@media (min-width: 992px) and (max-width: 1199px) {
    .albums-grid {
        --album-columns: 4;
    }
    
    .swiper-container:not([class*="columns-"]) .swiper-slide {
        width: calc(25% - var(--album-gap) * 3 / 4) !important;
    }
}

/* Планшеты (768px - 991px) */
@media (min-width: 768px) and (max-width: 991px) {
    .albums-grid {
        --album-columns: 3;
        --album-gap: 15px;
    }
    
    .swiper-container:not([class*="columns-"]) .swiper-slide {
        width: calc(33.333% - var(--album-gap) * 2 / 3) !important;
    }
    
    .album-details {
        padding: 12px;
    }
    
    .custom-audio-controls {
        padding: 6px 8px;
    }
    
    .time-display {
        font-size: 10px;
        min-width: 70px;
    }
}

/* Большие телефоны (576px - 767px) */
@media (min-width: 576px) and (max-width: 767px) {
    .albums-grid {
        --album-columns: 2;
        --album-gap: 15px;
    }
    
    .swiper-container:not([class*="columns-"]) .swiper-slide {
        width: calc(50% - var(--album-gap) / 2) !important;
    }
    
    .album-details {
        padding: 10px;
    }
    
    .custom-audio-controls {
        padding: 5px 6px;
        gap: 5px;
    }
    
    .play-pause-btn {
        width: 28px;
        height: 28px;
    }
    
    .time-display {
        font-size: 9px;
        min-width: 60px;
    }
    
    .volume-btn {
        width: 22px;
        height: 22px;
    }
    
    .album-info-overlay {
        flex-direction: column;
        align-items: flex-start;
        gap: 3px;
    }
}

/* Маленькие телефоны (до 575px) */
@media (max-width: 575px) {
    .albums-grid {
        --album-columns: 1;
        --album-gap: 15px;
    }
    
    .swiper-container:not([class*="columns-"]) .swiper-slide {
        width: 100% !important;
    }
    
    .album-preview {
        max-width: 300px;
        margin-left: auto;
        margin-right: auto;
    }
    
    .album-details {
        padding: 10px;
    }
    
    .custom-audio-controls {
        padding: 4px 5px;
        gap: 4px;
    }
    
    .play-pause-btn {
        width: 26px;
        height: 26px;
    }
    
    .time-display {
        font-size: 8px;
        min-width: 50px;
    }
    
    .volume-btn {
        width: 20px;
        height: 20px;
    }
    
    .album-info-overlay {
        flex-direction: column;
        align-items: flex-start;
        gap: 2px;
        font-size: 10px;
    }
}

/* Очень маленькие экраны (до 375px) */
@media (max-width: 375px) {
    .albums-grid {
        --album-gap: 10px;
    }
    
    .album-cover-wrapper {
        height: 160px;
    }
    
    .album-song {
        font-size: 14px;
    }
    
    .album-artist {
        font-size: 12px;
    }
    
    .custom-audio-controls {
        flex-wrap: wrap;
        justify-content: center;
    }
    
    .progress-container {
        order: 3;
        width: 100%;
        margin-top: 5px;
    }
}

/* Ландшафтная ориентация на мобильных */
@media (max-width: 900px) and (orientation: landscape) {
    .albums-grid {
        --album-columns: 3;
    }
    
    .swiper-container:not([class*="columns-"]) .swiper-slide {
        width: calc(33.333% - var(--album-gap) * 2 / 3) !important;
    }
}

/* ========== FULL NEWS STYLES ========== */

/* Основные стили */
.full-news {
    max-width: 100%
    margin: 0 auto;
    padding: 5px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    font-family: Arial, sans-serif;
}

.full-news-image {
    float: left;
    width: 300px;
    margin-right: 30px;
    margin-bottom: 20px;
    position: relative;
}

.full-news-image img {
    max-width: 100%;
    height: auto;
    border-radius: 6px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.full-news-info {
    overflow: hidden;
}

.full-news-info h1 {
    color: #333;
    font-size: 28px;
    margin-bottom: 5px;
    font-weight: 700;
}

.full-news-info h2 {
    color: #666;
    font-size: 18px;
    margin-bottom: 20px;
    font-weight: 500;
}

.info-section {
    margin-top: 20px;
    background: #f3f5f5;;
    padding: 15px;
    border-radius: 6px;
}

.info-line {
    margin: 12px 0;
    font-size: 15px;
    color: #555;
}

.info-line i {
    width: 20px;
    text-align: center;
    margin-right: 8px;
    color: #505949;
}

.info-line span {
    font-weight: 600;
    color: #3a492d;
}

.full-story-text {
    margin: 30px 0;
    line-height: 1.6;
    color: #333;
    padding: 15px;
    background: #f9f9f9;
    border-radius: 6px;
    clear: both;
}

/* Кнопка скачивания */
.download-btn-main {
    display: inline-block;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    padding: 15px 30px;
    margin: 10px 0;
    border-radius: 8px;
    text-decoration: none;
    text-align: center;
    font-weight: bold;
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px rgba(50, 50, 93, 0.11), 0 1px 3px rgba(0, 0, 0, 0.08);
}

.download-btn-main:hover {
    transform: translateY(-2px);
    box-shadow: 0 7px 14px rgba(50, 50, 93, 0.1), 0 3px 6px rgba(0, 0, 0, 0.08);
}

.download-btn-main i {
    margin-right: 8px;
}

/* Блоки */
.full-block {
    margin: 30px 0;
    padding: 20px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.full-block-title {
    font-size: 20px;
    margin-bottom: 15px;
    color: #333;
    border-bottom: 2px solid #38741a;
    padding-bottom: 10px;
}

.full-block-title i {
    margin-right: 10px;
    color: #38741a;
}

/* Видео блок */
.video-block {
    background: #758169;
}

.full-news-video {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
    height: 0;
    overflow: hidden;
}

.full-news-video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 6px;
}

/* Уведомления */
.legal-notice {
    background: #f8f9fa;
    padding: 9px;
    border-radius: 10px;
    margin: 6px 10px;
    border-left: 4px solid #38741a;
}

.notice-title {
    font-weight: 600;
    margin-bottom: 10px;
    color: #38741a;
    font-size: 18px;
}

.notice-title i {
    margin-right: 8px;
}

.notice-content {
    color: #555;
    line-height: 1.6;
}

.notice-content i {
    margin-right: 8px;
    color: #38741a;
}

.welcome-notice {
    background: #e8f4fd;
    border-left-color: #1a1a1a;
}

.welcome-notice .notice-title {
    color: #839278;
}

/* Теги */
.tags-block {
    margin: 30px 0;
    padding: 20px;
    background: #f8f9fa;
    border-radius: 6px;
}

.tags-title h3 {
    margin-bottom: 15px;
    color: #333;
}

.tags-title i {
    margin-right: 10px;
    color: #38741a;
}

.tags-list a {
    display: inline-block;
    background: #38741a;
    color: white;
    padding: 6px 12px;
    margin: 5px;
    border-radius: 4px;
    text-decoration: none;
    font-size: 14px;
    transition: background 0.3s;
}

.tags-list a:hover {
    background: #2a5b13;
}

/* Похожие треки и новинки */
.top-block {
    margin: 1px 10px;
    padding: 2px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.top-block-title {
    margin-bottom: 2px;
    padding-bottom: 2px;
    border-bottom: 2px solid #a5a5a5;
}

.top-block-title h2, .top-block-title h3 {
    color: #333;
    font-size: 22px;
    display: inline-block;
    margin: 0;
}

.top-block-title i {
    margin-right: 10px;
    color: #38741a;
}

.btn-more {
    display: inline-block;
    background: #5f6956;
    color: white;
    padding: 12px 25px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    transition: background 0.3s;
}

.btn-more:hover {
    background: #090909;
}

/* Избранное */
.addto-fav {
    display: inline-block;
    margin-top: 15px;
}

.addto-fav-button {
    display: inline-block;
    background: #667eea;
    color: white;
    padding: 10px 15px;
    border-radius: 5px;
    cursor: pointer;
    transition: background 0.3s;
}

.addto-fav-button:hover {
    background: #5a67d8;
}

.addto-fav-button i {
    margin-right: 5px;
}

/* Аудиоплеер */
.audio-player-wrapper {
    margin: 20px 0;
    width: 100%;
}

audio {
    width: 100%;
    height: 50px;
    border-radius: 25px;
    outline: none;
}

/* Очистка потока */
.clearfix::after {
    content: "";
    display: table;
    clear: both;
}

/* Адаптивность */
@media (max-width: 768px) {
    .full-news-image {
        float: none;
        width: 100%;
        margin-right: 0;
    }
    
    .full-news {
        padding: 2px;
    }
    
    .full-news-info h1 {
        font-size: 24px;
    }
    
    .download-btn-main {
        width: 100%;
        padding: 12px;
    }
    
    .top-block-content {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .full-news-info h1 {
        font-size: 20px;
    }
    
    .top-block-content {
        grid-template-columns: 1fr;
    }
}

/* ========== END FULL NEWS STYLES ========== */



/* === МИНИ-АДАПТИВ (добавьте в конец style.min.css) === */
@media (max-width: 1000px) {
  .main-center-block { width: auto; margin: 0; border-radius: 0; }
  .left-col { float: none; width: auto; padding: 0; }
  .center-col { float: none; width: auto; }
  .right-col { display: none; }
  .top-song { width: auto; display: block; margin: 0 0 10px; }
  .full-news-image { float: none; width: auto; margin: 0 0 15px; }
  .footer { width: auto; }
}

@media (max-width: 600px) {
  .search-block { position: static; width: auto; margin: 10px; }
  .navigation-left, .navigation-right, .navigation-center { display: block; text-align: center; }
  .navigation-left a, .navigation-right a, .navigation-center a { display: inline-block; margin: 3px; }
}

        .custom-heading {
            font-size: 20px;
            color: #333;
            font-weight: bold;
        }
        .hidden-schema {
            display: none;
        }
        .btn-more {
            text-decoration: none; 
            background-color: #505a4c 
            padding: 10px 20px; 
            border-radius: 8px; 
            color: #fff; 
            font-size: 16px; 
            font-weight: bold; 
            display: inline-block; 
            width: 100%; 
            box-sizing: border-box;
            transition: background-color 0.3s;
        }
        .btn-more:hover {
            background-color: #4d4e4c;
        }






/* Переменные для светлой и темной тем */
:root {
  --bg-primary: #ffffff;
  --bg-secondary: #f3f5f5;
  --bg-tertiary: #ffffff;
  --text-primary: #333333;
  --text-secondary: #666666;
  --text-muted: #999999;
  --border-color: #e0e0e0;
  --accent-color: #38741a;
  --accent-hover: #2a5b13;
  --shadow-color: rgba(0, 0, 0, 0.1);
  --card-bg: #ffffff;
  --player-bg: #ffffff;
  --header-bg: #38741a;
  --link-color: #38741a;
  --link-hover: #2a5b13;
}

.dark-theme {
  --bg-primary: #121212;
  --bg-secondary: #1e1e1e;
  --bg-tertiary: #252525;
  --text-primary: #ffffff;
  --text-secondary: #b0b0b0;
  --text-muted: #888888;
  --border-color: #333333;
  --accent-color: #3c4b2f;
  --accent-hover: #388E3C;
  --shadow-color: rgba(0, 0, 0, 0.3);
  --card-bg: #1e1e1e;
  --player-bg: #252525;
  --header-bg: #1a1a1a;
  --link-color: #4CAF50;
  --link-hover: #ffffff;
}

/* Отключаем переходы при переключении темы */
.dark-theme-transitioning * {
  transition: none !important;
}

/* Основные стили для темной темы */
.dark-theme {
  background-color: var(--bg-primary);
  color: var(--text-primary);
}

/* Базовые transition только для необходимых свойств */
body {
  transition: background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1),
              color 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ========== ОСНОВНЫЕ ЭЛЕМЕНТЫ ========== */

/* Блоки контента */
.dark-theme .main-center-block {
  background-color: var(--bg-secondary);
  box-shadow: 0 0 13px rgba(0, 0, 0, 0.5);
}

.dark-theme .center-block,
.dark-theme .top-block,
.dark-theme .wrapsearch,
.dark-theme .full-news,
.dark-theme .stt-block {
  background-color: var(--bg-tertiary);
  border: 1px solid var(--border-color);
}

/* Заголовки */
.dark-theme .center-block-title,
.dark-theme .top-block-title,
.dark-theme .full-news h1,
.dark-theme .full-block-title,
.dark-theme .category-title,
.dark-theme h1,
.dark-theme h2,
.dark-theme h3,
.dark-theme h4 {
  color: var(--text-primary) !important;
}

/* Текстовое содержимое */
.dark-theme .center-block-content,
.dark-theme .full-block-content,
.dark-theme .info-line,
.dark-theme .full-news-text,
.dark-theme .main-news-text,
.dark-theme .albums-news-text,
.dark-theme .hello-block-content,
.dark-theme .profile-tt-text {
  color: var(--text-secondary) !important;
}

/* Треки */
.dark-theme .top-song {
  background-color: var(--card-bg);
  border-color: var(--border-color);
}

.dark-theme .top-song:hover {
  background-color: var(--bg-secondary);
}

.dark-theme .top-song-author,
.dark-theme .top-song-song,
.dark-theme .new-song .top-song-link,
.dark-theme .left-song-author,
.dark-theme .left-song-song {
  color: var(--text-secondary) !important;
}

/* ========== ССЫЛКИ И НАВИГАЦИЯ ========== */

.dark-theme a {
  color: #a9bb9b !important;
}

.dark-theme a:hover {
  color: var(--link-hover) !important;
}

.dark-theme .info-line a {
  color: #fdfbfb !important;
}

.dark-theme .info-line a:hover {
  color: var(--link-hover) !important;
}

/* Навигация */
.dark-theme .navigation-left a {
  background-color: var(--bg-tertiary);
  color: var(--text-primary) !important;
}

.dark-theme .navigation-center a {
  background-color: #808c76;
  border-color: #000000;
}

/* ========== ФОРМЫ И КНОПКИ ========== */

/* Формы */
.dark-theme input,
.dark-theme textarea,
.dark-theme select,
.dark-theme .form-text,
.dark-theme .form-line-tt input,
.dark-theme .form-line-tt textarea,
.dark-theme .login-input-text,
.dark-theme .lost-input-text {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-color) !important;
}

/* Кнопки */
.dark-theme .form-button-tt,
.dark-theme input#dosearch,
.dark-theme input#dofullsearch,
.dark-theme .open-com-form,
.dark-theme .enter,
.dark-theme .vote-buttom {
  background-color: var(--accent-color) !important;
  color: white !important;
  border-color: var(--accent-color) !important;
}

.dark-theme .form-button-tt:hover,
.dark-theme input#dosearch:hover,
.dark-theme input#dofullsearch:hover,
.dark-theme .open-com-form:hover,
.dark-theme .enter:hover,
.dark-theme .vote-buttom:hover {
  background-color: var(--accent-hover) !important;
  border-color: var(--accent-hover) !important;
}

/* ========== ПЛЕЕР ========== */

.dark-theme .new-player {
  background-color: var(--player-bg);
}

.dark-theme .audioplayer-bar {
  background-color: #444;
}

.dark-theme .audioplayer-bar-played {
  background-color: var(--accent-color);
}

.dark-theme .fill-bar-glob {
  background-color: #444;
}

.dark-theme .pop-player-image.start-play-btn {
  background-color: var(--accent-color) !important;
}

.dark-theme .pop-player-image.start-play-btn:hover {
  background-color: var(--accent-hover) !important;
}

.dark-theme .pop-title-art {
  color: var(--text-secondary) !important;
}

.dark-theme .pop-title-song {
  color: var(--link-color) !important;
}

.dark-theme .pop-title-song:hover {
  color: var(--link-hover) !important;
}

/* ========== САЙДБАРЫ ========== */

.dark-theme .left-block-title,
.dark-theme .right-block-title {
  background-color: #5f6955 !important;
  color: white !important;
}

.dark-theme .right-block-content a {
  color: var(--text-secondary) !important;
}

.dark-theme .right-block-content a:hover {
  color: var(--text-primary) !important;
  background-color: var(--bg-secondary) !important;
}

/* ========== КОММЕНТАРИИ ========== */

.dark-theme .comment-item {
  background-color: var(--bg-tertiary);
  border-color: var(--border-color);
}

.dark-theme .comment-item-author {
  color: var(--link-color) !important;
}

.dark-theme .comment-item-date {
  color: var(--text-muted) !important;
}

.dark-theme .comment-item-text {
  color: var(--text-secondary) !important;
}

.dark-theme .comments-item-links a {
  color: var(--text-muted) !important;
  border-bottom-color: var(--border-color) !important;
}

.dark-theme .comments-item-links a:hover {
  color: var(--text-secondary) !important;
}

/* ========== СПЕЦИАЛЬНЫЕ ЭЛЕМЕНТЫ ========== */

/* Теги */
.dark-theme .tags-link a,
.dark-theme .tags-list a {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border: 1px solid var(--border-color) !important;
}

.dark-theme .tags-link a:hover,
.dark-theme .tags-list a:hover {
  background-color: var(--accent-color) !important;
  color: white !important;
  border-color: var(--accent-color) !important;
}

/* Цитаты */
.dark-theme .quote {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border-color: var(--border-color) !important;
}

/* Рейтинг */
.dark-theme .ratingtt-left a,
.dark-theme .ratingtt-center,
.dark-theme .ratingtt-right a {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border-color: var(--border-color) !important;
}

/* ========== XFIELDS (ДИНАМИЧЕСКИЕ ПОЛЯ) ========== */

.dark-theme [xfvalue],
.dark-theme .xfvalue,
.dark-theme .xfield {
  color: var(--text-secondary) !important;
}

.dark-theme [xfvalue author],
.dark-theme [xfvalue song],
.dark-theme .xfvalue-author,
.dark-theme .xfvalue-song {
  color: var(--text-primary) !important;
  font-weight: 600 !important;
}

/* ========== КНОПКА ПЕРЕКЛЮЧЕНИЯ ТЕМЫ ========== */

/* Фиксированная кнопка */
.theme-switcher {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 1000;
}

.theme-toggle {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: var(--accent-color);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
  transition: all 0.3s ease;
}

.theme-toggle:hover {
  transform: scale(1.1);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
}

.theme-toggle i {
  font-size: 20px;
  color: white;
}

.dark-theme .theme-toggle i.fa-sun {
  display: none;
}

.dark-theme .theme-toggle i.fa-moon {
  display: inline-block;
}

.theme-toggle i.fa-moon {
  display: none;
}

.theme-toggle i.fa-sun {
  display: inline-block;
}

/* Кнопка в шапке */
.header-theme-switcher {
  position: absolute;
  top: 15px;
  right: 15px;
  z-index: 100;
}

.header-toggle {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--bg-tertiary);
  border: 2px solid var(--border-color);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: var(--text-primary);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.header-toggle:hover {
  transform: scale(1.1);
  border-color: var(--accent-color);
  box-shadow: inset 20px -17px 20px 20px rgb(243 245 245);
}

.dark-theme .header-toggle {
  background: #3a4a2d;;
}

/* ========== ИСПРАВЛЕНИЯ ДЛЯ КОНКРЕТНЫХ ЭЛЕМЕНТОВ ========== */

/* Информация о треке */
.dark-theme .full-news-info .info-line {
  color: var(--text-secondary) !important;
}

.dark-theme .full-news-info .info-line .info-value {
  color: #fdfbfb !important;
}

/* Уведомления */
.dark-theme .legal-notice {
  background-color: var(--bg-tertiary) !important;
  border: 1px solid var(--border-color) !important;
  color: var(--text-secondary) !important;
}

.dark-theme .legal-notice .notice-title {
  background-color: #252525 !important;
  color: white !important;
  border-bottom: 1px solid #656363 !important;
}

.dark-theme .legal-notice .notice-content {
  color: var(--text-secondary) !important;
}

.dark-theme .legal-notice strong span,
.dark-theme .legal-notice strong span b {
  color: var(--text-primary) !important;
  font-weight: 600 !important;
}

.dark-theme .legal-notice .notice-content span[style*="color: rgb(62, 117, 46)"] {
  color: var(--accent-color) !important;
}

/* Welcome notice */
.dark-theme .welcome-notice {
  background: linear-gradient(135deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%) !important;
  border-color: #595959 !important;
}

.dark-theme .welcome-notice .notice-title {
  background-color: #252525 !important;
  color: white !important;
}

/* Блок тегов */
.dark-theme .tags-block {
  background-color: var(--bg-tertiary) !important;
  border: 1px solid var(--border-color) !important;
}

.dark-theme .tags-title {
  background-color: var(--bg-secondary) !important;
  border-bottom: 1px solid var(--border-color) !important;
  color: var(--text-primary) !important;
}

.dark-theme .tags-title h3 {
  color: var(--text-primary) !important;
}

.dark-theme .tags-title i {
  color: var(--accent-color) !important;
}

/* ========== ИКОНКИ ========== */

.dark-theme .full-news-info .fa,
.dark-theme .legal-notice .fa,
.dark-theme .tags-block .fa,
.dark-theme .welcome-notice .fa,
.dark-theme .features-list i,
.dark-theme .disclaimer i {
  color: var(--accent-color) !important;
}

/* ========== МЕДИА-ЗАПРОСЫ ========== */

@media (max-width: 768px) {
  .theme-switcher {
    bottom: 70px;
    right: 15px;
  }
  
  .theme-toggle {
    width: 45px;
    height: 45px;
  }
  
  .header-theme-switcher {
    top: 10px;
    right: 10px;
  }
  
  .header-toggle {
    width: 36px;
    height: 36px;
    font-size: 16px;
  }
}

/* ========== ИЗОБРАЖЕНИЯ В ТЕМНОЙ ТЕМЕ ========== */

.dark-theme img:not(.logo):not(.avatar) {
  opacity: 0.9;
  filter: brightness(0.9);
}

.dark-theme img:hover {
  opacity: 1;
  filter: brightness(1);
}

/* Фоновые изображения */
.dark-theme .main-center-block {
  position: relative;
}

.dark-theme .main-center-block::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.7);
  z-index: 0;
}

.dark-theme .main-center-block > * {
  position: relative;
  z-index: 1;
}

/* ========== ДОПОЛНИТЕЛЬНЫЕ ЭЛЕМЕНТЫ ========== */

/* Мобильное меню */
.dark-theme .mob-panel {
  background-color: var(--bg-tertiary);
}

.dark-theme .mob-shad {
  background: #000;
  opacity: 0.8;
}

/* Таблицы */
.dark-theme table {
  background-color: var(--bg-tertiary);
}

.dark-theme table tr:nth-child(even) {
  background-color: var(--bg-secondary);
}

.dark-theme table td {
  border-color: var(--border-color);
  color: var(--text-secondary) !important;
}

/* Футер */
.dark-theme .footer {
  color: var(--text-secondary);
}

.dark-theme .footer a {
  color: var(--text-primary);
}

/* Disclaimer */
.dark-theme .disclaimer {
  background-color: var(--bg-secondary) !important;
  color: var(--text-secondary) !important;
  border-left-color: var(--accent-color) !important;
}

/* Профиль пользователя */
.dark-theme .user-profile-tt,
.dark-theme .tabs-profile .tt-panel {
  background-color: var(--bg-tertiary) !important;
  border-color: var(--border-color) !important;
}

.dark-theme .profile-tt-info,
.dark-theme .profile-tt-text {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
}

.dark-theme .profile-tt-menu a {
  background-color: var(--bg-secondary) !important;
  color: var(--text-secondary) !important;
}

.dark-theme .profile-tt-menu a:hover {
  background-color: var(--accent-color) !important;
  color: white !important;
}

/* Модальные окна */
.dark-theme .ui-dialog {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

.dark-theme .ui-dialog-titlebar {
  background-color: var(--bg-secondary) !important;
  border-bottom-color: var(--border-color) !important;
}

.dark-theme .ui-dialog-buttonset {
  background-color: var(--bg-secondary) !important;
  border-top-color: var(--border-color) !important;
}

.dark-theme .ui-dialog-buttonset button {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
}

.dark-theme .ui-dialog-buttonset button:hover {
  background-color: var(--accent-color) !important;
  color: white !important;
}

/* ========== ACCESSIBILITY ========== */

.dark-theme :focus-visible {
  outline: 2px solid var(--accent-color);
  outline-offset: 2px;
}

/* Указываем браузеру о поддержке тем */
:root {
  color-scheme: light dark;
}

/* ========== ДОПОЛНЕНИЯ ДЛЯ DARK MODE ========== */

/* Стили для динамически генерируемых полей [xfvalue] */
.dark-theme [xfvalue],
.dark-theme .xfvalue,
.dark-theme .xfield {
  color: var(--text-secondary) !important;
}

.dark-theme [xfvalue author],
.dark-theme [xfvalue song],
.dark-theme .xfvalue-author,
.dark-theme .xfvalue-song {
  color: var(--text-primary) !important;
}

/* Специально для полей author и song в разных местах */
.dark-theme .left-song-author,
.dark-theme .left-song-song,
.dark-theme .top-song-author,
.dark-theme .top-song-song,
.dark-theme .new-song .top-song-link,
.dark-theme .new-song .top-song-author,
.dark-theme .new-song .top-song-song {
  color: var(--text-secondary) !important;
}

/* Для заголовков в разных блоках */
.dark-theme .main-news-title a,
.dark-theme .albums-news-title a,
.dark-theme .full-news-info h1,
.dark-theme .full-news-info h2,
.dark-theme .full-block-title,
.dark-theme .center-block-title,
.dark-theme .category-title,
.dark-theme .top-block-title {
  color: var(--text-primary) !important;
}

/* Для текстового содержимого */
.dark-theme .main-news-text,
.dark-theme .albums-news-text,
.dark-theme .full-news-text,
.dark-theme .full-block-content,
.dark-theme .center-block-content,
.dark-theme .info-line,
.dark-theme .hello-block-content,
.dark-theme .profile-tt-text {
  color: var(--text-secondary) !important;
}

/* Для ссылок */
.dark-theme .main-news-title a:hover,
.dark-theme .albums-news-title a:hover,
.dark-theme .full-block-content a {
  color: var(--link-hover) !important;
}

/* Для мета-информации */
.dark-theme .info-line a {
  color: #abbb9c !important;
}

.dark-theme .info-line a:hover {
  color: var(--link-hover) !important;
}

/* Для элементов форм в темной теме */
.dark-theme .form-line-tt input,
.dark-theme .form-line-tt textarea,
.dark-theme .login-input-text,
.dark-theme .lost-input-text {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-color) !important;
}

/* Для кнопок в темной теме */
.dark-theme .open-com-form,
.dark-theme .enter,
.dark-theme .vote-buttom,
.dark-theme .form-button-tt {
  background-color: var(--accent-color) !important;
  color: white !important;
  border-color: var(--accent-color) !important;
}

.dark-theme .open-com-form:hover,
.dark-theme .enter:hover,
.dark-theme .vote-buttom:hover,
.dark-theme .form-button-tt:hover {
  background-color: var(--accent-hover) !important;
  border-color: var(--accent-hover) !important;
}

/* Для плеера */
.dark-theme .pop-player-image.start-play-btn {
  background-color: var(--accent-color) !important;
}

.dark-theme .pop-player-image.start-play-btn:hover {
  background-color: var(--accent-hover) !important;
}

.dark-theme .pop-title-art {
  color: var(--text-secondary) !important;
}

.dark-theme .pop-title-song {
  color: var(--link-color) !important;
}

.dark-theme .pop-title-song:hover {
  color: var(--link-hover) !important;
}

/* Для правой колонки */
.dark-theme .right-block-content a {
  color: var(--text-secondary) !important;
}

.dark-theme .right-block-content a:hover {
  color: var(--text-primary) !important;
  background-color: var(--bg-secondary) !important;
}

.dark-theme .tags-link a {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
}

.dark-theme .tags-link a:hover {
  background-color: var(--accent-color) !important;
  color: white !important;
}

/* Для комментариев */
.dark-theme .comment-item-author {
  color: var(--link-color) !important;
}

.dark-theme .comment-item-date {
  color: var(--text-muted) !important;
}

.dark-theme .comment-item-text {
  color: var(--text-secondary) !important;
}

.dark-theme .comments-item-links a {
  color: var(--text-muted) !important;
  border-bottom-color: var(--border-color) !important;
}

.dark-theme .comments-item-links a:hover {
  color: var(--text-secondary) !important;
}

/* Для цитат */
.dark-theme .quote {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border-color: var(--border-color) !important;
}

/* Для рейтинга */
.dark-theme .ratingtt-left a,
.dark-theme .ratingtt-center,
.dark-theme .ratingtt-right a {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border-color: var(--border-color) !important;
}

/* Для модальных окон */
.dark-theme .ui-dialog {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

.dark-theme .ui-dialog-titlebar {
  background-color: var(--bg-secondary) !important;
  border-bottom-color: var(--border-color) !important;
}

.dark-theme .ui-dialog-buttonset {
  background-color: var(--bg-secondary) !important;
  border-top-color: var(--border-color) !important;
}

.dark-theme .ui-dialog-buttonset button {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
}

.dark-theme .ui-dialog-buttonset button:hover {
  background-color: var(--accent-color) !important;
  color: white !important;
}

/* Для профиля пользователя */
.dark-theme .user-profile-tt,
.dark-theme .tabs-profile .tt-panel {
  background-color: var(--bg-tertiary) !important;
  border-color: var(--border-color) !important;
}

.dark-theme .profile-tt-info,
.dark-theme .profile-tt-text {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
}

.dark-theme .profile-tt-menu a {
  background-color: var(--bg-secondary) !important;
  color: var(--text-secondary) !important;
}

.dark-theme .profile-tt-menu a:hover {
  background-color: var(--accent-color) !important;
  color: white !important;
}

/* Для списков */
.dark-theme .features-list li {
  color: var(--text-secondary) !important;
}

.dark-theme .features-list i {
  color: var(--accent-color) !important;
}

.dark-theme .disclaimer {
  background-color: var(--bg-secondary) !important;
  color: var(--text-secondary) !important;
  border-left-color: #ffffff !important;
}

.dark-theme .disclaimer i {
  color: var(--accent-color) !important;
}

/* Исправляем контрастность для всех текстовых элементов */
.dark-theme *:not(a):not(button):not(input):not(textarea):not(select):not([class*="icon"]):not([class*="fa-"]):not(i) {
  color: var(--text-primary) !important;
}

.dark-theme *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not([class*="title"]):not([class*="name"]):not(a):not(button) {
  color: #ffffff !important;
}

/* Важное правило для всех элементов - переопределяем цвет текста */
.dark-theme {
  color: var(--text-primary) !important;
}

.dark-theme div,
.dark-theme span,
.dark-theme p,
.dark-theme li,
.dark-theme td,
.dark-theme th {
  color: var(--text-secondary) !important;
}

.dark-theme h1,
.dark-theme h2,
.dark-theme h3,
.dark-theme h4,
.dark-theme h5,
.dark-theme h6,
.dark-theme [class*="title"],
.dark-theme [class*="name"],
.dark-theme [author],
.dark-theme [song] {
  color: var(--text-primary) !important;
}

/* Базовые стили (светлая тема) */
.main-center-block {
    background: #f3f5f5 var(--bg-image-light) left top repeat-y;
}

.top-block-title {
    background: var(--bg-image-light) left top no-repeat;
}

/* Темная тема */
.dark-theme .main-center-block {
    background: var(--bg-secondary) var(--bg-image-dark) left top repeat-y !important;
}

.dark-theme .top-block-title {
    background: var(--bg-tertiary) var(--bg-image-dark) left top no-repeat !important;
}
/* ========== ИСПРАВЛЕНИЯ ДЛЯ ПРОБЛЕМНЫХ ЭЛЕМЕНТОВ ========== */

/* 1. Для основной информации о треке */
.dark-theme .full-news-info .info-line .info-value,
.dark-theme .full-news-info .info-line {
    color: #acbb9e !important;
}

/* Специально для автора и названия трека в info-line */
.dark-theme .full-news-info .info-line .info-value span,
.dark-theme .full-news-info .info-line [xfvalue_author],
.dark-theme .full-news-info .info-line [xfvalue_song] {
    color: var(--text-primary) !important;
    font-weight: 600;
}

/* Переопределяем встроенные стили для xfvalue */
.dark-theme [xfvalue_author],
.dark-theme [xfvalue_song] {
    color: var(--text-primary) !important;
    font-family: inherit !important;
    font-weight: 600 !important;
}

/* Для всех элементов с xfvalue_ */
.dark-theme [xfvalue_],
.dark-theme *[xfvalue_] {
    color: var(--text-secondary) !important;
}

/* 2. Для уведомления (legal-notice) */
.dark-theme .legal-notice {
    background-color: var(--bg-tertiary) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-secondary) !important;
}

.dark-theme .legal-notice .notice-title {
    background-color: #808c76 !important;
    color: white !important;
    border-bottom: 1px solid var(--border-color) !important;
}

.dark-theme .legal-notice .notice-title i {
    color: white !important;
}

.dark-theme .legal-notice .notice-content {
    color: var(--text-secondary) !important;
}

/* Специально для встроенных стилей в уведомлении */
.dark-theme .legal-notice strong span {
    color: var(--text-primary) !important;
    font-family: inherit !important;
}

.dark-theme .legal-notice strong span b,
.dark-theme .legal-notice strong b {
    color: var(--text-primary) !important;
    font-weight: 600 !important;
}

/* Переопределяем конкретный встроенный стиль */
.dark-theme .legal-notice .notice-content span[style*="color: rgb(62, 117, 46)"] {
    color: var(--accent-color) !important;
}

.dark-theme .legal-notice .notice-content span[style*="font-family: Arial"] {
    font-family: inherit !important;
}

/* 3. Для тегов */
.dark-theme .tags-block {
    background-color: var(--bg-tertiary) !important;
    border: 1px solid var(--border-color) !important;
}

.dark-theme .tags-title {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
}

.dark-theme .tags-title h3 {
    color: var(--text-primary) !important;
}

.dark-theme .tags-title i {
    color: var(--accent-color) !important;
}

.dark-theme .tags-list a {
    background-color: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
    border: 1px solid var(--border-color) !important;
}

.dark-theme .tags-list a:hover {
    background-color: var(--accent-color) !important;
    color: white !important;
    border-color: var(--accent-color) !important;
}

/* 4. Для welcome-notice */
.dark-theme .welcome-notice {
    background: linear-gradient(135deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%) !important;
    border-color: #808c76 !important;
}

.dark-theme .welcome-notice .notice-title {
    background-color: #808c76 !important;
    color: white !important;
}

.dark-theme .welcome-notice .notice-content i {
    color: var(--accent-color) !important;
}

/* 5. СИЛЬНЫЙ ПЕРЕОПРЕДЕЛЯЮЩИЙ СТИЛЬ для всех проблемных элементов */
.dark-theme .full-news-info *,
.dark-theme .legal-notice *,
.dark-theme .tags-block * {
    color: inherit !important;
    background-color: inherit !important;
    border-color: inherit !important;
}

/* 6. Для иконок FontAwesome в этих блоках */
.dark-theme .full-news-info .fa,
.dark-theme .legal-notice .fa,
.dark-theme .tags-block .fa {
    color: var(--accent-color) !important;
}





/* Основные стили аудиоплеера */
.player-container {
    max-width: 100%;
    margin: 5px auto;
    padding: 10px;
    background: #1a1a1a;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
}

/* Скрываем стандартный аудио элемент */
.custom-audio-player audio {
    display: none !important;
    visibility: hidden !important;
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
}

/* Контейнер элементов управления */
.player-controls {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 25px;
    flex-wrap: wrap;
}

/* Кнопка воспроизведения/паузы */
.play-btn {
    width: 50px;
    height: 50px;
    min-width: 50px;
    border-radius: 50%;
    background: #616b58;
    border: none;
    color: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    outline: none;
    position: relative;
    overflow: hidden;
}

.play-btn:focus-visible {
    outline: 2px solid #4a6cf7;
    outline-offset: 2px;
}

.play-btn:hover {
    background: #3d4d30;
    transform: scale(1.05);
}

.play-btn:active {
    transform: scale(0.95);
}

.play-btn::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    transform: translate(-50%, -50%) scale(0);
    transition: transform 0.3s ease;
}

.play-btn:active::after {
    transform: translate(-50%, -50%) scale(1);
    animation: ripple 0.6s linear;
}

@keyframes ripple {
    0% {
        transform: translate(-50%, -50%) scale(0);
        opacity: 1;
    }
    100% {
        transform: translate(-50%, -50%) scale(2);
        opacity: 0;
    }
}

/* Область прогресса */
.progress-area {
    flex-grow: 1;
    min-width: 200px;
}

/* Прогресс-бар */
.progress-bar {
    height: 6px;
    background: #333;
    border-radius: 3px;
    cursor: pointer;
    margin-bottom: 8px;
    position: relative;
    overflow: hidden;
    transition: background 0.2s ease;
}

.progress-bar:hover {
    background: #444;
}

/* Индикатор прогресса */
.progress {
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, #2c411b, #829279);
    border-radius: 3px;
    transition: width 0.1s linear;
    position: relative;
}

.progress::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 12px;
    height: 12px;
    background: white;
    border-radius: 50%;
    opacity: 0;
    transition: opacity 0.2s ease;
    box-shadow: 0 0 5px rgba(0,0,0,0.5);
}

.progress-bar:hover .progress::after {
    opacity: 1;
}

/* Таймер */
.timer {
    display: flex;
    justify-content: space-between;
    color: #999;
    font-size: 13px;
    font-family: 'Roboto Mono', 'Courier New', monospace;
    letter-spacing: -0.5px;
}

.timer span {
    opacity: 0.9;
}

/* Контроль громкости */
.volume-control {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #999;
    min-width: 120px;
}

.volume-control i {
    font-size: 16px;
    transition: color 0.2s ease;
}

.volume-control:hover i {
    color: #4a6cf7;
}

/* Слайдер громкости */
.volume-slider {
    width: 80px;
    height: 4px;
    -webkit-appearance: none;
    background: #333;
    border-radius: 2px;
    outline: none;
    cursor: pointer;
    transition: background 0.2s ease;
}

.volume-slider:hover {
    background: #444;
}

.volume-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #4a6cf7;
    cursor: pointer;
    border: 2px solid white;
    box-shadow: 0 0 5px rgba(0,0,0,0.5);
    transition: all 0.2s ease;
}

.volume-slider::-webkit-slider-thumb:hover {
    background: #3a5ce5;
    transform: scale(1.1);
}

.volume-slider::-moz-range-thumb {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #4a6cf7;
    cursor: pointer;
    border: 2px solid white;
    box-shadow: 0 0 5px rgba(0,0,0,0.5);
}

.volume-slider::-moz-range-track {
    background: #333;
    height: 4px;
    border-radius: 2px;
}

/* Кнопка скачивания */
.download-btn-modern {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    background: linear-gradient(
93deg, #8c9b80 0%, #344525 100%);
    color: white;
    padding: 16px 40px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: inset -2px 6px 13px 0px rgb(70 86 57 / 77%);
    border: none;
    cursor: pointer;
    width: 100%;
    max-width: 300px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
}

.download-btn-modern::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: left 0.5s ease;
}

.download-btn-modern:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 25px rgba(75,95,62);
    color: white;
}

.download-btn-modern:hover::before {
    left: 100%;
}

.download-btn-modern:active {
    transform: translateY(0);
    box-shadow: 0 2px 10px rgba(74, 108, 247, 0.3);
}

.download-btn-modern i {
    font-size: 18px;
    transition: transform 0.3s ease;
}

.download-btn-modern:hover i {
    transform: translateY(2px);
}

/* Адаптивность */
@media (max-width: 768px) {
    .player-container {
        margin: 15px;
        padding: 20px;
        border-radius: 15px;
    }
    
    .player-controls {
        gap: 15px;
        flex-direction: column;
        align-items: stretch;
    }
    
    .progress-area {
        width: 100%;
    }
    
    .volume-control {
        width: 100%;
        justify-content: space-between;
    }
    
    .volume-slider {
        flex-grow: 1;
        max-width: 150px;
    }
    
    .download-btn-modern {
        padding: 14px 30px;
        font-size: 15px;
    }
}

@media (max-width: 480px) {
    .player-container {
        padding: 15px;
        margin: 10px;
    }
    
    .play-btn {
        width: 45px;
        height: 45px;
        min-width: 45px;
    }
    
    .timer {
        font-size: 12px;
    }
    
    .download-btn-modern {
        padding: 12px 25px;
        font-size: 14px;
    }
}

/* Состояния загрузки */
.player-container.loading .progress {
    background: linear-gradient(90deg, #4a6cf7 25%, #8a67ff 50%, #4a6cf7 75%);
    background-size: 200% 100%;
    animation: loading 1.5s infinite linear;
}

@keyframes loading {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

/* Состояние ошибки */
.player-container.error .play-btn {
    background: #ff4757;
}

.player-container.error .progress {
    background: #ff4757;
}

/* Улучшенный focus-visible для доступности */
.play-btn:focus-visible,
.volume-slider:focus-visible,
.download-btn-modern:focus-visible {
    outline: 2px solid #4a6cf7;
    outline-offset: 2px;
}

/* Темная тема по умолчанию (уже используется) */
.player-container.dark {
    background: #1a1a1a;
    color: #fff;
}

/* Светлая тема */
.player-container.light {
    background: #ffffff;
    color: #333;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}

.player-container.light .progress-bar {
    background: #e0e0e0;
}

.player-container.light .timer {
    color: #666;
}

.player-container.light .volume-control {
    color: #666;
}

.player-container.light .volume-slider {
    background: #e0e0e0;
}





.artist-header{
display:flex;
align-items:center;
gap:25px;
padding:25px;
background:#181818;
border-radius:18px;
margin-bottom:25px;
}

.artist-cover img{
width:170px;
height:170px;
object-fit:cover;
border-radius:50%;
box-shadow:0 10px 30px rgba(0,0,0,.3);
}

.artist-name{
font-size:34px;
font-weight:700;
margin-bottom:10px;
}

.artist-desc{
opacity:.85;
line-height:1.7;
margin-bottom:15px;
}

.artist-meta{
display:flex;
gap:20px;
flex-wrap:wrap;
}

.artist-meta span{
background:#222;
padding:8px 16px;
border-radius:30px;
font-size:14px;
}

